<script lang="ts" setup>
import { get, post, message, loadFile } from '@/utils'
import { FormInstance } from '@arco-design/web-vue'
const props = defineProps<{
  show: boolean
  id: number | string
}>()
const emit = defineEmits(['update:show', 'reset', 'confirm'])
const formRef = ref() as Ref<FormInstance>
const detail = reactive({
  id: props.id || '',
  accessKey: '',
  category: 2,
  createDept: 0,
  createTime: '',
  createUser: 0,
  isDeleted: 0,
  regionId: '',
  remark: '',
  secretKey: '',
  signName: '',
  smsCode: '',
  status: 0,
  templateId: '',
})
const submit = done => {
  formRef.value.validate(err => {
    if (!err) {
      const query = Object.assign({}, detail)
      post(
        { url: '/server-resource/admin/sms/submit', data: query },
        ({ code, msg }) => {
          message({
            type: code == 200 ? 'success' : 'error',
            content: msg,
          })
          if (code == 200) {
            emit('update:show', false)
            emit('confirm')
          }
          done(code == 200)
        },
        () => done(false)
      )
    } else done(false)
  })
}
const getInfo = () => {
  get({ url: '/server-resource/admin/sms/detail', data: { id: props.id } }, ({ data }) => {
    Object.assign(detail, data)
  })
}
onMounted(() => {
  if (props.id) getInfo()
})
</script>
<template>
  <CDrawer v-model:visible="props.show" @before-ok="submit" :mask-closable="false" width="500px" :title="props.id ? '编辑' : '新建'" @cancel="emit('update:show', false)">
    <div class="content">
      <a-form :model="detail" ref="formRef" :label-col-props="{ span: 6 }" :wrapper-col-props="{ span: 16 }">
        <a-form-item label="分类">
          <a-radio-group
            v-model="detail.category"
            :options="[
              { label: '七牛云', value: 2 },
              { label: '阿里云', value: 3 },
              { label: '腾讯云', value: 4 },
            ]"
          />
        </a-form-item>
        <a-form-item label="资源编号" field="smsCode" :rules="[{ required: true, message: '请输入资源编号' }]" :validate-trigger="['change', 'blur']">
          <a-input v-model="detail.smsCode" placeholder="请输入资源编号" />
        </a-form-item>
        <a-form-item label="模板ID" field="templateId" :rules="[{ required: true, message: '请输入模板ID' }]" :validate-trigger="['change', 'blur']">
          <a-input v-model="detail.templateId" placeholder="请输入模板ID" />
        </a-form-item>
        <template v-if="[2, 3].includes(detail.category)">
          <a-form-item label="accessKey" field="accessKey" :rules="[{ required: true, message: '请输入accessKey' }]" :validate-trigger="['change', 'blur']">
            <a-input v-model="detail.accessKey" placeholder="请输入accessKey" />
          </a-form-item>
          <a-form-item label="secretKey" field="secretKey" :rules="[{ required: true, message: '请输入secretKey' }]" :validate-trigger="['change', 'blur']">
            <a-input v-model="detail.secretKey" placeholder="请输入secretKey" />
          </a-form-item>
          <a-form-item label="短信签名" field="signName" :rules="[{ required: true, message: '请输入短信签名' }]" :validate-trigger="['change', 'blur']">
            <a-input v-model="detail.signName" placeholder="请输入短信签名" />
          </a-form-item>
        </template>

        <template v-if="detail.category == 3">
          <a-form-item label="regionId" field="regionId" :rules="[{ required: true, message: '请输入regionId' }]" :validate-trigger="['change', 'blur']">
            <a-input v-model="detail.regionId" placeholder="请输入regionId" />
          </a-form-item>
        </template>
        <template v-if="detail.category == 4">
          <a-form-item label="appId" field="accessKey" :rules="[{ required: true, message: '请输入appId' }]" :validate-trigger="['change', 'blur']">
            <a-input v-model="detail.accessKey" placeholder="请输入appId" />
          </a-form-item>
          <a-form-item label="appKey" field="secretKey" :rules="[{ required: true, message: '请输入appKey' }]" :validate-trigger="['change', 'blur']">
            <a-input v-model="detail.secretKey" placeholder="请输入appKey" />
          </a-form-item>
          <a-form-item label="短信签名" field="signName" :rules="[{ required: true, message: '请输入短信签名' }]" :validate-trigger="['change', 'blur']">
            <a-input v-model="detail.signName" placeholder="请输入短信签名" />
          </a-form-item>
        </template>
        <a-form-item label="备注" field="remark" :rules="[{ required: true, message: '请输入备注' }]" :validate-trigger="['change', 'blur']">
          <a-textarea v-model="detail.remark" placeholder="请输入备注" />
        </a-form-item>
      </a-form>
    </div>
  </CDrawer>
</template>
<style lang="less" scoped></style>
